<template>
	<view @click.stop="bodyClick">
		<vs-nav-bar background="#fff" :title="info.name" fixed topHeight></vs-nav-bar>
		<view class="box">
			<view class="content">
				<h3>{{info.name}}</h3>
				<u-parse :html="content"></u-parse>
			</view>
			<comment-list @response="responseComment" :list="list"></comment-list>
			<view class="pinglun">
				
			</view>
			<view>
				<comment-input @send="saveComments" :focus="focus" :placeholder="placeholder" v-model="sendQuery.content"></comment-input>
			</view>
		</view>
	</view>
</template>

<script>
	import {getCommentList,saveComment,getDetailById} from '@/api/homeapi'
	import commentList from '../../../components/commentlist'
	import commentInput from '../../../components/commentinput'
	export default{
		components:{commentList,commentInput},
		data(){
			return{
				info:{},
				list:[],
				focus:false,
				placeholder:'写评论',
				content:'',
				sendQuery:{
					content:'',
					type:'新闻',
					pId:'',
					title:'',
					refCreaterId:'',
					refId:''
				}
			}
		},
		onLoad(){
			this.info=this.$Route.params.info
			this.getDetailbyid()
			setTimeout(()=>{
				this.getList()
			},1500)
		},
		methods:{
			getList(){
				getCommentList({refId:this.info.id}).then(res=>{
					// console.log(res);
					this.list = res.data
				})
			},
			getDetailbyid(){
				this.$fn.loading(5)
				getDetailById({id:this.info.id,action:'newsDetail'}).then(res=>{
					// console.log(res);
					this.content = res.data.obj.content
					uni.hideLoading()
				})
			},
			saveComments(){
				// console.log(666);
				this.sendQuery.refId = this.info.id
				saveComment(this.sendQuery).then(res=>{
					// console.log(res);
					this.sendQuery.content=""
					this.getList()
				})
			},
			responseComment(e){
				console.log(e);
				this.focus = false
				setTimeout(()=>{
					this.focus = true
					this.sendQuery.pId = e.id
					this.placeholder = '回复@'+e.creater
				},100)
			},
			bodyClick(){
				this.focus = false
				this.placeholder = '写评论'
				this.sendQuery.pId = ''
				this.sendQuery.content = ''
			}
			
			
			
		}
	}
</script>

<style lang="scss" scoped>
	.box{
		padding-bottom: 200rpx;
		
		.content{
			width: 90%;
			margin: 0 auto;
			padding-top: 10px;
			font-size: 14px;
			color: #666;
		}
		
	}
</style>
